<template>
    <div>
        <van-dialog v-model="dialogShow" :close-on-popstate="true" title="温馨提示" :message="message" :cancelButtonText="cancelButtonText" :confirmButtonText="confirmButtonText" show-cancel-button @confirm="closeDialog('confirm')" @cancel="closeDialog('cancel')"></van-dialog>
    </div>
</template>

<script>
export default {
    name: 'checkboxGroup',
    props: {
        type: {
            type: String,
            default: '0'
        },
        dialogShow: {
            type: Boolean,
            default: true
        },
        title: {
            type: String,
            default: '温馨提示'
        },
        message: {
            type: String,
            default: ''
        },
        cancelButtonText: {
            type: String,
            default: '取消'
        },
        confirmButtonText: {
            type: String,
            default: '确定'
        },
    },
    data() {
        return {}
    },
    methods: {
        closeDialog(type) {
            console.log(this.dialogShow);
            // this.dialogShowVal = false
            this.$emit('update:dialogShow', false);
            this.$emit('closeDialogResult', this.type, type);
            return;
        }
    }
}
</script>

<style scoped lang="less">
.footer-box {
    height: 6.5vh;
    border-top: 1px solid #dbdbdb;
    background: #fff;
    display: flex;
    padding: 5px 0;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;

    div {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        font-size: 10px;
        color: #999;
    }

    div:first-child {
        position: relative;
    }

    div:first-child:after {
        content: "";
        height: 15px;
        width: 1px;
        border-left: 1px dashed #dcdcdc;
        position: absolute;
        right: 0;
    }

    img {
        width: 18px;
        height: 21px;
    }

    .isActive {
        color: #366cb3;
    }
}
</style>
